import { MenuProps } from 'antd';
import { useUserStore } from '@/stores/userStore';
import { useMemo } from 'react';
import { useTranslation } from 'react-i18next';
import {
  HomeOutlined,
  UnorderedListOutlined,
  UploadOutlined,
  UserOutlined,
} from "@ant-design/icons";

interface MenuItem {
  ps_id: number;
  ps_name: string;
  ps_pid: number;
  ps_level: number;
  id: number;
  ps_api_path: string;
  ps_api_service: string;
  ps_api_order: string;
  children?: MenuItem[];
}

const getIcon = (service: string) => {
  switch (service) {
    case "Home":
      return <HomeOutlined />;
    case "List":
      return <UnorderedListOutlined />;
    case "Upload":
      return <UploadOutlined />;
    case "Admin":
      return <UserOutlined />;
    default:
      return null;
  }
};

const convertToMenuItems = (items: MenuItem[], t: (key: string) => string): MenuProps["items"] => {
  return items.map((item) => ({
    key: item.ps_api_path,
    icon: getIcon(item.ps_api_service),
    label: t(`menu.${item.ps_api_service}`),
    children: item.children ? convertToMenuItems(item.children, t) : undefined,
  }));
};

export const useMenuItems = () => {
  const { permissions } = useUserStore();
  
  const { t } = useTranslation();

  const menuItems = useMemo(() => {
    return convertToMenuItems(permissions, t);
  }, [permissions, t]);

  return menuItems;
};
